<template>
  <view class="menu">
    <view
      class="view"
      v-for="item in dataList"
      @click="goto(item.sb)"
      :key="item"
    >
      <image :src="item.url" mode=""></image>
      <view style="margin-top: 10rpx">{{ item.text }}</view>
    </view>
  </view>
</template>

<script>
export default {
  name: "menus",
  data() {
    return {
      dataList: [
        {
          url: "../../static/iamges/huiyuan.png",
          text: "持仓",
          sb: "/pages/bonds/bonds",
        },
        {
          url: "../../static/iamges/wode/zhangdan@2x.png",
          text: "账单",
          sb: "/pages/bill/bill",
        },
        {
          url: "../../static/iamges/wode/qiandao@2x.png",
          text: "签到",
          sb: "/pages/qiandao/qiandao",
        },
        {
          url: "../../static/iamges/wode/yinhangka@2x.png",
          text: "银行卡",
          sb: "/pages/bankcard/bankcard",
        },
      ],
    };
  },
  methods: {
    goto(url) {
      if (!uni.getStorageSync("token")) {
        uni.showModal({
          title: "提示",
          content: "请先登录",
          success: function (res) {
            if (res.confirm) {
              console.log("用户点击确定");
              uni.navigateTo({
                url: "/pages/login/login",
              });
            }
          },
        });
      }else{
		   uni.navigateTo({
        url,
      });
	  }

     
    },
  },
};
</script>

<style lang="scss" scoped>
.menu {
  background-color: #ffffff;
  height: 162rpx;
  width: 702rpx;
  border-radius: 30rpx;
  margin: -100rpx auto;
  display: flex;
  box-shadow: 0px 2px 40rpx 0rpx rgba($color: #000000, $alpha: 0.4);
  box-sizing: border-box;
  .view {
    width: 25%;

    box-sizing: border-box;
    height: 100%;
    text-align: center;
    padding-top: 15rpx;
    image {
      height: 80rpx;
      width: 80rpx;
    }
  }
}
</style>
